한입 시리즈의 3번째 강의
한 입 크기로 잘라먹는 Next.js의 제작이 드디어 완료되었습니다.
약 일주일의 검토 기간을 거쳐 8월 19일(월)에 오픈 될 예정입니다.
그동안 많은 관심과 응원 보내주셨던 분들께 감사의 말씀 드립니다 🙇♂️
사전등록 이벤트 안내
이번에도 역시! 파격적인 사전등록 이벤트를 약 일주일간 진행합니다.
신청만 하셔도 최소 50% 할인 쿠폰을 받으실 수 있으니
꼭 신청하시고 여기저기 소문도 많이 내 주시면 감사하겠습니다 😃
사전등록 혜택
- 신청자 전원 50% 할인 쿠폰 제공
- 추첨 30명 100% 할인 쿠폰 제공
- 사전등록 완료 시 “히든 이벤트” 참가 방법 안내
사전 등록 일정
- 08월 12일(월) ~ 08월 18일(일) 자정까지
그 밖의 안내 사항
- 강의는 인프런과 유데미에 동시 오픈됩니다.
- 오픈 시간은 8월 19일(월)이며 플랫폼 검토 기간에 따라 일부 변동(1~2일)이 있을 수 있습니다.
강의 소개
한입 시리즈의 3번째 강의 한 입 크기로 잘라먹는 Next.js는
15시간 이상의 분량으로 Page Router부터 App Router까지
Next.js의 전반적인 모든 개념을 다루는 강의입니다.
구체적으로는 Page Router 5시간, App Router 10시간 구성으로 제작되었습니다.
수강 대상 안내
본 강의는 React + TypeScript에 대한 기초 지식이 있는 사람을 대상으로 제작되었습니다.
따라서 본 강의 수강 이전에 한입 리액트, 한입 타입스크립트를 선수강 하시는 걸 가장 권장드립니다.
그러나 TypeScript를 모르신다고 하더라도 수강이 불가능하지는 않습니다.
TypeScript 기초 지식이 없으신 분들도 함께 수강하실 수 있도록
중간중간 부연설명이나 타입스크립트 무료 학습 자료를 첨부해 드릴테니 함께 학습하셔도 좋을 것 같습니다.
커리큘럼 안내
전체 플레이타임은 15시간 36분이며 총 62개의 챕터로 이루어져 있습니다.
다음은 섹션별로 나뉘어진 커리큘럼의 구체적인 소개입니다.
🌱 Section 1. Next.js를 소개합니다
기술을 잘 이해하려면 그것이 어떤 배경에서 탄생했는지 알 필요가 있습니다.
1섹션에서는 본격적인 학습에 앞서 Next.js라는 기술은 무엇인지
오늘날 왜 이렇게 많은 관심을 받고 있는지 살펴봅니다.
🌱 Section 2. Page Router 핵심 정리
(선택 수강) 프로젝트와 함께 Next.js 출시 초기부터 제공된 Page Router에 대해 빠르게 살펴봅니다.
동시에 Page Router에 어떠한 불편함과 기술적 한계점 들이 있는지도 함께 살펴봅니다.
🌱 Section 3. App Router 시작하기
화제의 중심! App Router에 대해 살펴봅니다.
App Router란 무엇인지, 어떤 기술적 차이가 있는지 알아보며 기본적인 사용법에 대해서도 함께 살펴봅니다.
🌱 Section 4. 데이터 페칭
서버 컴포넌트를 활용한 데이터 페칭에 대해 살펴봅니다.
더불어 Next에서 제공하는 다양한 캐싱(데이터 캐시, 리퀘스트 메모이제이션)에 대해서도 함께 살펴봅니다.
🌱 Section 5. 페이지 캐싱
App Router 버전의 페이지 캐싱인 풀 라우트 캐시와 클라이언트 라우터 캐시에 대해 자세히 살펴봅니다.
더불어 페이지의 캐싱 옵션을 강제로 설정하는 라우트 세그먼트 옵션에 대해서도 추가로 살펴봅니다
🌱 Section 6. 스트리밍 & 에러 핸들링
페이지에서 빠르게 준비되는 부분부터 바로 렌더링 하도록 도와주는 스트리밍에 대해 살펴봅니다.
Loading 파일을 이용한 방식과 Suspense를 이용한 두가지 방식을 모두 살펴봅니다.
또한 Error 파일을 이용한 에러 핸들링 및 페이지 복구 방법에 대해서도 살펴봅니다.
🌱 Section 7. 서버 액션
공개당시 뜨거운 반응을 불러일으킨 서버액션에 대해 살펴봅니다.
서버액션을 이용해 데이터를 추가하거나 삭제하며 로딩 상태와 에러 상태를 처리하는 방법까지 살펴봅니다.
🌱 Section 8. 고급 라우팅 패턴(패럴랠, 인터셉팅)
App Router에서 새롭게 제공되는 패럴랠(병렬) 라우트와 인터셉팅(가로채기) 라우트에 대해 살펴봅니다.
이를 통해 페이지 이동시에 사용자의 탐색을 방해하지 않도록 특정 페이지를 모달로 보여주는 기능을 구현합니다.
🌱 Section 9. 최적화와 배포
이미지, 메타데이터, 페이지, 리전 등의 최적화 방법을 살펴봅니다.
최적화 된 프로젝트를 Vercel에 배포하고 한번 더 성능을 개선하는 작업을 진행합니다.
이 강의의 특징
특징 1. 직관적이고 풍부한 시각자료
Next.js는 복잡한 매커니즘을 갖는 기능이 많은 편입니다.
따라서 정적인 시각자료 만으로는 충분히 설명되기 어렵습니다.
이에 본 강의는 아래와 같은 직관적인 애니메이션과 함께합니다
특징 2. 좋은 발성과 딕션
오랜 시간 제 목소리를 들으셔야 하는 만큼 좋은 발성과 딕션을 위해 항상 노력하고 있습니다.
이를 위해 2배속으로 재생해도 다 알아들으실 수 있게끔 강의를 제작했습니다.
특징3. 섹션별로 깔끔하게 정리된 실습 코드
언제든 다시 돌아볼 수 있도록 코드를 섹션별로 잘 나누어 보관할 수 있도록 신경썼습니다.
마치며
한입 시리즈의 3번째 정식 강의로 제작되는 만큼 더 높은 잣대와 기준으로 강의를 제작하였습니다.
그래서 그동안 좋은 평가를 받았던 부분은 최대한 유지하고
반대로 좋지 않은 평가를 받았던 부분은 최대한 보완하려고 노력했습니다.
그러니 Next.js를 제대로 배워보실 의향이 있으시다면
아래의 사전 등록 폼으로 신청해주시면 정말 감사하겠습니다.
마지막으로 그동안 많은 응원과 사랑을 보내주신 우리 한입 커뮤니티 여러분께 무한한 감사의 말씀을 드립니다.
여러분이 있기에 이번 강의도 포기하지 않고 끝까지 제작할 수 있었습니다 정말 감사합니다.